instal :
composer require mews/captcha

find :
config/app.php

provide :
        Mews\Captcha\CaptchaServiceProvider::class,

aliases :
        'Captcha' => 'Mews\Captcha\Facades\Captcha',

run :
php artisan vendor:publish --provider="Mews\Captcha\CaptchaServiceProvider"

add :
.env :
CAPTCHA_DISABLE=true

web.php
use Mews\Captcha\Facades\Captcha;

// Captcha
Route::get('/captcha', function () {
    return Captcha::create('flat');
});


login blade :

 <div class="mb-3">
                        <img src="{{ captcha_src('flat') }}" style="cursor:pointer;" class="w-100 mb-2">
                        <div class=" d-flex justify-content-between align-items-center gap-1">
                            <input type="text" wire:model.defer="captcha" placeholder="Masukkan CAPTCHA"
                                class="form-control">
                            <button wire:click="$refresh" type="button"
                                class="btn btn-warning fw-semibold text-white"><i
                                    class="fa-solid fa-arrows-rotate"></i></button>
                        </div>
                        @error('captcha')
                            <span class="text-danger mt-1" style="font-size: 11.5px">{{ $message }}</span>
                        @enderror
                    </div>


component :
tambahkan :

public $captcha;

 $this->validate([
            'captcha' => 'required|captcha',
        ], [
            'captcha.captcha' => 'Kode keamanan tidak valid, silakan coba lagi.',
        ]);



---------------------------

web.php

// captcha
Route::get('refresh-captcha', function () {
return response()->json(['captcha' => captcha_src('flat')]);
});




login.php :


<div class="mb-3">
<img src="{{ captcha_src('flat') }}" style="cursor:pointer;" class="w-100 mb-2"
id="captcha-image" style="width: 100%">
<div class=" d-flex justify-content-between align-items-center gap-1">
<input type="text" name="captcha" id="captcha"
placeholder="Masukkan CAPTCHA" class="form-control">
<button type="button" class="btn btn-info btn-refresh"><i
class="fa-solid fa-arrows-rotate text-white"></i></button>
</div>
@error('captcha')
<span class="text-danger mt-1" style="font-size: 11.5px">{{ $message }}</span>
@enderror
</div>




<script>
document.querySelector('.btn-refresh').addEventListener('click', function() {
fetch('/refresh-captcha')
.then(response => response.json())
.then(data => {
document.querySelector('#captcha-image').src = data.captcha;
});
});
</script>